<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>患者详情</title>
    <style>
        body {
            font-family: Arial, "微软雅黑", sans-serif;
            background-color: #F8F8FF;
            color: #333;
            margin: 0;
            padding: 20px;
        }

        header {
            background-color: #007bff;
            color: white;
            padding: 10px;
            text-align: center;
            font-size: 24px;
        }

        main {
            max-width: 800px;
            margin: 0 auto;
            background-color: #fff;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            padding: 20px;
            border-radius: 5px;
        }

        #patientInfo {
            margin-top: 30px;
        }

        #detailsContainer {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
            margin-bottom: 20px;
        }

        .infoLabel {
            font-weight: bold;
            text-align: right;
            padding-right: 10px;
        }

        .infoValue {
            text-align: left;
        }

    </style>
</head>
<body>
<header>
    <h1>医院名称</h1>
</header>
<main>
    <section id="patientInfo">
        <h2>患者详情</h2>
        <div id="detailsContainer">
            <!-- 详情将在这里动态加载 -->
        </div>
    </section>
</main>
<script >
    document.addEventListener('DOMContentLoaded', () => {
        fetch('/web/detel') // 假设resultservlet位于应用的根路径
            .then(response => response.json())
            .then(data => {
                console.log(data);
                const detailsContainer = document.getElementById('detailsContainer');
                detailsContainer.innerHTML = `
                <div>
                    <span class="infoLabel">姓名:</span>
                    <span class="infoValue">${data.uname}</span>
                </div>
                <div>
                    <span class="infoLabel">性别:</span>
                    <span class="infoValue">${data.sex}</span>
                </div>
                <div>
                    <span class="infoLabel">年龄:</span>
                    <span class="infoValue">${data.age}</span>
                </div>
                <div>
                    <span class="infoLabel">身份证号:</span>
                    <span class="infoValue">${data.idcard}</span>
                </div>
                <div>
                    <span class="infoLabel">挂号医生姓名:</span>
                    <span class="infoValue">${data.doctor_name}</span>
                </div>
                <div>
                    <span class="infoLabel">诊断结果:</span>
                    <span class="infoValue">${data.doctor_specialty}</span>
                </div>
            `;
            })
            .catch(error => console.error('Error fetching patient details:', error));
    });

</script>
</body>
</html>
